/* ====================================== toast  ====================================== */
import React from 'react'
// =====================================================================
const { $fn, $Lazy } = window
// ===================================================================== Import
const FormItem 	= $Lazy.load(()=>import('@antd/form/layout/item'))
const Select 	= $Lazy.load(()=>import('@antd/form/select'))
const Input 	= $Lazy.load(()=>import('@antd/form/input'))
//
const $cache = $Lazy.file(()=>import('#private/cache-api'))
// ===================================================================== data

// ===================================================================== Select
class Index extends React.Component {
	state = {
		rulesData:[],
		resultData:[]
	}
	
	componentDidMount(){
		$cache.then( async f => {
			if(!$fn.hasArray(this.state.rulesData)){
				const rulesData = await f.getDicCache({ code: 1300 })
				const resultData = await f.result_data
				this.setState({ rulesData, resultData })
			}
		})
	}
	
	render(){
		const { rulesData, resultData } = this.state
		let  { size = 'small', bordered, readOnly, clear, name, required } = this.props
		
		const w = '25%'
		const props = { 
			size, 
			readOnly, 
			bordered, 
			clear
		}
		return (
			<div className='fx'>
				<FormItem width={w} name={ name?.[0] } mb={10} rules={[ {required, message:'请选择转换数据'} ]}>
					<Select data={resultData} p='转换数据' {...props} />
				</FormItem>
				<FormItem width={w} name={ name?.[1] } ml={10} mr={10} mb={10} rules={[ {required, message:'请选择转换规则'} ]}>
					<Select data={rulesData} idStr='code' p='转换规则' {...props}/>
				</FormItem>
				<FormItem className='ex' name={ name?.[2] } mb={10} rules={[ {required, message:'请输入转换条件值'} ]}>
					<Input name={ name?.[2] } p='转换条件值' {...props} mode='number' />
				</FormItem>
			</div>
		)
	}
}
export default Index